



import React, { useMemo, useState, useEffect } from 'react'
import "./index.scss"
import { Tabs } from 'antd';
import LoginAccount from './loginaccount';
import LoginPhone from './loginphone';

export default function Login() {
    const [selectKey, setSelectKey] = useState('username')
    const changeSearch = (value: any) => {
        setSelectKey(value)
    }
    const { TabPane } = Tabs;
    return (
        <div style={{ width: '100%', height: '100vh', position: 'relative' }}>
            <div className='box'>
                <h2>欢迎登录管理系统</h2>
                <Tabs onChange={changeSearch} centered animated activeKey={selectKey}>
                    <TabPane tab="用户名登录" key="username">
                        {useMemo(() => <LoginAccount />, [selectKey])}
                        {/* <LoginAccount /> */}
                    </TabPane>
                    <TabPane tab="手机号登录" key="phone">
                        {useMemo(() => <LoginPhone />, [selectKey])}
                        {/* <LoginPhone /> */}
                    </TabPane>
                </Tabs>
            </div>
        </div>
    )
}

